@charset "utf-8";
body{margin: 0 auto;min-width: 1000px;background-position: center;}
a{text-decoration: none;color: #000;}
ul ,li {list-style-type: none;-webkit-padding-start: 0px;-webkit-margin-after: 0em;-webkit-margin-before: 0em;}
table{border-spacing: 0px;-webkit-border-horizontal-spacing: 0px;-webkit-border-vertical-spacing: 0px;}
p{-webkit-margin-before: 0em;-webkit-margin-after: 0em;}
figure{-webkit-margin-before: 0em;-webkit-margin-after: 0em; -webkit-margin-start: 0px;-webkit-margin-end: 0px;}
input {padding: 0px 0px;border: 0px;}
button{border: 0px; background:transparent ;}


/*loading*/
        .di{
            width: 600px;
            height: 40px;
            background-color: #999;
            margin: 0 auto;
            position: relative;
            border-radius: 3px;
            position: absolute;
            bottom: -116px;
            left: 31%;
           
        }
        .lubj{
        	display: inline-block;
        	width: 600px;
            height: 40px;
            background-color: #93cce6;
            border-radius: 3px;
            position: absolute;
            z-index: 1;
            top: -3px;
            left: 3px;
        }
        .kuai {
            display: inline-block;
            width: 100%;
            height: 100%;
            animation:wave 3s linear infinite;
           background-image: url(images/kuai.png);
           background-repeat-x: repeat;
           background-repeat-y:no-repeat;
        }

@-webkit-keyframes wave{
	from{background-position:0px 0px}
	100%{background-position:60px 0px}
}
@keyframes wave{
	from{background-position:0px 0px}
	100%{background-position:60px 0px}
}
@-moz-keyframes wave{
	from{background-position:0px 0px}
	100%{background-position:60px 0px}
}
@-o-keyframes wave{
	from{background-position:0px 0px}
	100%{background-position:60px 0px}
}












/*login*/
.loginscene{
	width: 205px;
	height: 100px;
	margin: 0 auto;
	left: 39%;
    top:67%;
    position: absolute;
    z-index: 1;
}
.loginkuang{
	width: 200px;
	height: 35px;
	margin-top:5px;
}
.loginanniu{
    width: 100px;
    height: 40px;
    margin-top:5px;
    margin-left: -5px;
    background-image: url("images/login.png");
}
.zhuceanniu{
	display: inline;
    width: 100px;
    height: 40px;
    margin-top:5px;
    margin-left: 10px;
    background-image: url("images/register.png");
}
#formbg{
    height: 100%;
    width: 100%;
    background-color: rgba(3,3,3,0.5);
    position: absolute;
    z-index: 100;
    top: 0px;
    left: 0px;
}
#formbg2{
    height: 200px;
    width: 400px;
    background-color: rgba(123,123,123,0.5);
    position: absolute;
    z-index: 100;
    top: 0%;
    left: 29%;
    color: #fff;
}
.button{
    display: inline-block;
    border: 0px;
    background-image: url(images/subm.png);
    width: 200px;
    height: 50px;
    font-size: 20px;
    color: #fff;
    text-align: center;
    line-height: 40px;
    margin-top: 30px;
}
.required{
    width: 200px;
    height: 30px;
}
.forgetpwd{
	display: inline;
    width: 100px;
    height: 40px;
    margin-top:35px;
    margin-left: 10px;
}
.forget{
	border:1px solid #000;
	width:200px;
	height:200px;
    position: absolute;
    z-index: 10;
}






/*schedule*/
.sai1{
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.5);
}
   #zuoqie{
    width:85px;
    height: 80px;
    background-image: url(images/turnleft.png);
    float: left;
    position: absolute;
    z-index: 2;
    top: 43%;
    left: 11%;
   }
   #youqie{
    width:85px;
    height: 80px;
    background-image: url(images/turnright.png);
    float: left;
    position: absolute;
    z-index: 2;
    top: 43%;
    left: 83%;
   }
   #main{
        width: 567px;
        height: 399px;
        position: absolute;
        top: 20%;
        left: 22%;
        z-index: 1;
        background-image: url(images/sai1.png);
   }
  .yes{
    display: inline-block;
    width: 100px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    color: #fff;
    background-color: #ea3;
    position: absolute;
    font-size: 20px;
        bottom: 5%;
        left: 45%;
        z-index: 1;
    }










/*saiduan*/
.saiduan{
    width: 960px;
    height: 660px;
    background:#212121;
    margin-top: 300px;
    text-align: center;
    font-size: 40px;
    color: #6DA807;
}
.duan1{
    width: 360px;
    height: 50px;
    font-size: 40px;
    color: #3E5D0A;
    position: absolute;
    top: 336px;
    left: 300px;
}
.duan{
    display: block;
    width: 110px;
    height: 110px;
    float: left;
    margin-left: 100px;
    margin-top: 419px;
    position: relative;
}
.suo{
    position: absolute;
    background-image: url("images/suo.png");
    width: 50px;
    height: 50px;
    top: 60%;
}







/*PlayScene*/

        #renmain{
             width:140px;
             height:120px;
             position: absolute;
             position: relative;
             /*-webkit-transition:left 6s linear;*/
         }
        .biker{
            background: url(images/biker1.png);
            width:72px;
            height: 92px;
            position: absolute;
            z-index: 101;
            bottom: 16%;
            left: 26%;
        }
        .bike{
            background: url(images/bike1.png) no-repeat;
            width:100px;
            height: 36px;
            position: absolute;
            z-index: 100;
            bottom: 16%;
            left: 20%;
        }
        .lwhell{
            height: 36px;
            width: 40px;
            display: inline-block;
            position: absolute;
            z-index: 90;
            bottom: 6px;
            left: 19%;
            /*-webkit-animation:show .5s linear infinite;*/
        }
        .rwhell{
            height: 36px;
            width: 40px;
            display: inline-block;
            margin-left:17px;
            position: absolute;
            z-index: 90;
            bottom: 6px;
            left: 48% ;
            /*-webkit-animation:show .5s linear infinite;*/
        }
        #ditu{
            width:6000px;
            height: 100%;
            
            position: relative;
            background-position:0px -100px;
        }
        .timebut{
            position: absolute;
            z-index: 1;
            top: 10px;
            width: 64px;
            height: 64px;
            color: #999;
        }
        .runfar{
            position: absolute;
            z-index: 4;
            top: 10px;
            width: 250px;
            height: 57px;
            background: url("images/mingbj.png") no-repeat;
            color: #fff;
        }
        .runtime{
            position: absolute;
            z-index: 5;
            top: 70px;
            width: 150px;
            height:40px;
            background: url("images/timebj.png");
            color: #212121;
        }
        .guanka{
        	position: absolute;
            z-index: 5;
            top: 10px;
            right: 150px;
            width: 200px;
            height:50px;
            font-size: 30px;
            background: url("images/guankabj.png");
        }
        .mcbj{
        	position: absolute;
            z-index: 5;
            top: 10px;
            right: 3px;
            width: 100px;
            height:100px;
            font-size: 45px;
            color: #9DF200; 
            background: url("images/mcbj.png");
        }
        .suduji{
        	position: absolute;
            z-index: 5;
            top: 60px;
            right: 150px;
            width: 200px;
            height:50px;
            font-size: 30px;
            background: url("images/kuang.png");
        }
        .sudujiji{
            position: absolute;
            top: 64px;
            left: 64%;
            width: 10px;
            height:40px;
            background: #9DF200; 
            border-radius:12px;
        }
        .directionBtnCanvas{
            position:absolute;
            top:56%;
            left:70%;
            z-index:100;
        }
        @-webkit-keyframes show{
        0%{
            -webkit-transform:rotate(0deg);
        }
        100%{
            -webkit-transform:rotate(360deg);
        }
    }
    .water{
        display: inline-block;

        width: 300px;
        height: 60px;
        background-image: url(images/shui1.png);
    }
    .coin{
        display: inline-block;
        width: 60px;
        height: 60px;
        background-image: url(images/coin.png);
    }
    .coin_c{
        width: 150px;
        height: 30px;
        top: 110px;
        left: 0px;
        background-image: url("images/qianbj.png");
        font-size: 25px;
    }
    .mosha{
        //display: inline-block;
        width: 300px;
        height: 60px;
        background-image: url(images/mosha.png);
    }
    .imgcenter{
        position: absolute;
        background-repeat:no-repeat;
        background-size: contain;
        background-position: center;
    }










/*mainscene*/
.mainscene{
    width: 635px;
    height: 300px;
    margin: 0 auto;
    margin-top: 430px;
    /*width: 789px;
    height: 557px;
    margin: 0 auto;
    padding-top: 186px;
    background-image: url("images/mainscene.png");
    background-color:#73D4CB;*/
}
.mainscene1{
    width: 100px;
    height:100px ;
    background-image:url(images/shop1.png);
    float: left;
}
.mainscene2{
    width: 100px;
    height:100px ;
    margin-left: 150px;
    float: left;
    background-image:url(images/start.png);
}
.mainscene3{
    width: 100px;
    height:100px;
    margin-left: 150px;
    float: left;
    background-image:url(images/help.png);

}
.outlogin{
    width: 64px;
    height: 64px;
    background-image:url(images/outlogin.png);
    position:absolute;
    bottom: 12px;
    right: 12px;
}
















/*equip*/
#equip{
    width: 740px;
    height: 600px;
    margin: 0 auto;
    padding-top: 186px;
}
#equipren{
    width: 140px;
    height: 190px;
    float: left;
    border: 1px solid #93cce6;
}

#equiprenzi{
    width: 140px;
    height: 70px;
    border: 1px solid #A0887A;
    font-size: 18px;
    color: #333;
    text-align:center;
}
.equipspan{
    font-size: 16px;
    color: #A0887A;
}
.zhuangbei{
    width: 500px;
    height: 372px;
    margin-left: 50px;
    float: left;
    box-shadow: 3px 3px 3px 3px rgba(0, 64, 128, 0.3);
}
.zbul{
    width: 490px;
    height: 40px;
    margin:5px 5px;
}
.zbul>li{
    float: left;
    width: 120px;
    height: 40px;
    box-shadow:1px 1px 1px 1px rgba(132, 79, 64, 0.3);
}
.zhbeli{
    display: inline-block;
    width: 120px;
    height: 40px;
    line-height: 40px;
    text-align: center;
}
.zhbeli:link,.zhbeli:visited{
    font-size:18px;font-family: "Microsoft YaHei";color:#333;background-color: #BCE6E2;}

.zhbeli:hover,.zhbeli:active{
    font-size:18px;font-family: "Microsoft YaHei";color:#333;background-color: #73D4CB;}
.retur{
    width: 82px;
    height: 82px;
    position: absolute;
    
    background-image: url("images/close.png");
    top: 10%;
    left:85%;
}
.dajing{
    width:100%;
    height: 100%;
    background-color:rgba(0, 0, 0, 0.3);
}
.jing{
    width:200px;
    height: 100px;
    background-color: #93cce6;
    position: absolute;
    top: 50%;
    left:40%;
    text-align: center;
}
.jingbut{
    display: block;
    margin: 0 auto;
    margin-top:10px;
}
#jam{
    width:100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3);

}
#jam1{
    width:500px;
    height: 300px;
    background-image: url(images/HowToPlay.png);
    /*background-color: rgba(0, 0, 0, 0.7);*/
    color: #fff;
    text-align: center;
    position: absolute;
    z-index: 100;
    top: 0%;
    left: 24%;

}






/*shop*/
.zhbetable{
    width: 490px;
    height: 240px;
}
.zbtab{
    width: 110px;
    height: 165px;
    background-color: #93cce6;
    float: left;
    margin: 5px 5px;
    box-shadow:3px 3px 3px 3px rgba(0, 64, 128, 0.3);
}
.zbtabtr1{
    width: 110px;
    height: 100px;
    /*background-color: #6DA807;*/
}
.zbtabtr2{
    width: 110px;
    height: 20px;
    /*background-color: #ccffaa;
    box-shadow:3px 3px 3px 3px rgba(0, 64, 128, 0.3);*/
}













/*mineacene*/
.mineacene{
    width: 800px;
    height: 600px;
    margin: 0 auto;
}
.ming{
    width: 250px;
    height: 57px;
    position: absolute;
    top: 290px;
    left:30px;
    background: url("images/mingbj.png") no-repeat;
    font-size: 20px;
    color: #fff;
    text-align: center;
    line-height: 57px;
}
.qian{
    width: 150px;
    height: 70px;
    position: absolute;
    top: 280px;
    font-size: 20px;
    color: #fff;
    text-align: center;
    line-height: 70px;
    left: 250px;
    background-image: url("images/qianbj.png");
}
.vip{
	width: 150px;
    height: 70px;
    position: absolute;
    top:320px;
    font-size: 20px;
    color: #fff;
    text-align: center;
    line-height: 70px;
    left: 250px;
}
.chong{
    width: 60px;
    height: 33px;
    position: absolute;
    top: 307px;
    left: 420px;
    font-size: 20px;
    background-color: #066D55;
}
.cho{
    width: 130px;
    height: 30px;
    position: absolute;
    top:196px;
    left: 340px;
    font-size: 22px;
    color: #fff;
    z-index: 100;
}
.seleinput{
    width: 130px;
    height: 30px;
    position: absolute;
    top:190px;
    left: 445px;
    font-size: 20px;
    z-index: 100;
}
.sele{
    width: 130px;
    height: 30px;
    position: absolute;
    top: 230px;
    left: 445px;
    font-size: 20px;
    z-index: 100;
}

.zonghe{
    width: 150px;
    height: 50px;
    text-align: center;
    line-height: 50px;
    font-size: 20px;
    border:1px solid #878787;
    box-shadow:3px 3px 3px 3px rgba(0, 64, 128, 0.3);
}
.shji{
    float: left;
    background-color: #018578;
    position: absolute;
    top: 4px;
}
.shjiqian{
    width: 100px;
    height: 30px;
    line-height: 30px;
    background-image: url("images/shjibj.png");
    float: left;
    position: absolute;
    left: 44px;
    top: -4px;
}
.zuoqie{
    width: 20px;
    height: 20px;
    position: absolute;
    background-image: url("images/sturnleft.png");
 }
.youqie{
    width: 20px;
    height: 20px;
    position: absolute;
    background-image: url("images/sturnright.png");
}
.home{
    width: 100px;
    height: 30px;
    background-image: url("images/home.png");
    position: absolute;
    bottom:13px;
    left: 85%;;
}
.shuoming{
    width: 155px;
    height: 23px;
    position: absolute;
    top:35%;
    left: 150%;
    -webkit-border-radius:8px;
    background-color: rgba(212, 243, 174, 0.8);

}
.shuoming>span{
    font-size: 18px;
    color: #0407A0;
}











/*OverScene*/
.OverScene{
    width: 960px;
    height: 600px;
    background-image: url(images/winbj.png);
}
.top{
    width: 180px;
    height: 250px;
    background: url(images/win-lv.png) no-repeat;
    position: absolute;
    top: 17%;
    left: 30%;
    z-index: 3;
}
.second{
    width: 180px;
    height: 250px;
    background: url(images/win-lan.png) no-repeat;
    position: absolute;
    top: 22%;
    left: 14%;
    z-index: 2;
}
.three{
    width: 180px;
    height: 250px;
    background: url(images/win-yezi.png) no-repeat;
    position: absolute;
    top: 26%;
    left: 46%;
    z-index: 1;
}
.mingci{
    width: 180px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 20px;
    color: #aaf;
    position: absolute;
    top: 14%;
    left: 65%;
}
.mingci>span{
    font-size: 25px;
    color: #ff00ff;
}
.next{
    width: 100px;
    height: 30px;
    background: url(images/next.png);
    position: absolute;
    top: 64%;
    left: 66%;
}
.replay{
    width: 30px;
    height: 30px;
    background: url(images/replay.png);
    position: absolute;
    top: 64%;
    left: 77%;
}
.wan{
    width: 300px;
    height: 211px;
    background: url(images/PopupBackgroundMain.png);
    background-size:contain;
    position: absolute;
    z-index: 100;
    top: 0%;
    left: 33%;
    font-size: 30px;
    color: #fff;

}
.wanq{
    width: 30px;
    height: 30px;
    position: absolute;
    z-index: 100;
    background: url(images/close.png);
    background-size:contain;
    top: 0;
    left: 62%;
}